// 扫码添加商品

<template>
  <view class="page">
    <!-- 相机 -->
    <camera
      class="camera"
      mode="scanCode"
      device-position="back"
      flash="auto"
      @initdone="initdone"
      @scancode="scancode"
    >
      <view class="camera-outside" v-if="initdoneFlag">
        <view class="camera-border">
          <view class="border b1"></view>
          <view class="border b2"></view>
          <view class="border b3"></view>
          <view class="border b4"></view>
          <view class="camera-animation" :animation="animationData"></view>
        </view>
        <view class="camera-tip">将条形码放入框内，即可自动扫描</view>
      </view>
    </camera>
    <!-- 商品 -->
    <view class="goods-box">
      <view class="item" v-for="(item, index) in goodsList" :key="item.id">
        <view class="item-left">
          <image mode="aspectFill" :src="item.goods_image | filterImgUrl" />
        </view>
        <view class="item-right">
          <view class="item-name">{{ item.goods_name }}</view>
          <view class="item-info">
            <view>编号：{{ item.goods_code }}</view>
            <view>总库存：{{ item.stock }}{{ item.unit_name }}</view>
            <view>数量：{{ item.number }}{{ item.unit_name }}</view>
          </view>
        </view>
        <text
          class="iconfont icon-shanchu"
          @tap="goodsList.splice(index, 1), (scanFlag = true)"
        ></text>
      </view>
    </view>
    <mes-button type="2" :form="buttonForm"></mes-button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      goodsList: [],
      initdoneFlag: false,
      scanFlag: true,
      pageType: '',
      animationData: {},
      // 商品类型（1：原材料，2：成品）
      goods_types: 1,
      buttonForm: {
        text: '保存',
        confirmEvent: () => {
          this.scanDone()
        }
      }
    }
  },
  onLoad(options) {
    this.pageType = options.type
    this.init()
    console.log('赋值之后的type', this.pageType)
  },
  onShow() {
    this.scanAnimation()
  },
  methods: {
    // 相机初始化完成
    initdone() {
      this.initdoneFlag = true
    },
    // 扫码动画
    scanAnimation() {
      let animation = uni.createAnimation()
      let flag = true
      setInterval(
        function () {
          if (flag) {
            animation.translateY(200).step({ duration: 2000 })
          } else {
            animation.translateY(-10).step({ duration: 2000 })
          }
          flag = !flag
          this.animationData = animation.export()
        }.bind(this),
        2000
      )
    },
    // 监听扫码
    async scancode(e) {
      if (this.scanFlag) {
        this.scanFlag = false
        const res = await this.$api.prod.common.getGoodsList({
          keyword: e.detail.result,
          goods_types: this.goods_types
        })
        if (res.code == 200) {
          if (!res.data.list.length) {
            uni.showToast({
              title: '未查询到此商品',
              icon: 'none'
            })
          } else {
            uni.showToast({
              title: '扫描成功',
              icon: 'none'
            })

            res.data.list.forEach((item) => {
              let findRes = this.goodsList.find((item1) => item1.id == item.id)
              if (findRes) {
                // 已经存在，赋值number
                this.goodsList.map((item1) => {
                  if (item1.id == item.id) item1.number++
                })
              } else {
                item.number = 1
                this.goodsList.push(item)
              }
            })
          }
        }
        setTimeout(() => {
          this.scanFlag = true
        }, 1500)
      }
    },
    // 扫描完成
    async scanDone() {
      if (!this.goodsList.length) {
        return uni.showToast({
          title: '请添加商品',
          icon: 'none'
        })
      }

      const filterRes = this.goodsList
      switch (this.pageType) {
        case 'process': // 生产工序
          this.process(filterRes)
          break
        case 'prod_plan': // 生产计划
        case 'productions': // 生产单
          this.prod_plan(filterRes)
          break
        case 'receipt': // 验收单
          this.receipt(filterRes)
          break
        case 'requisition': // 领料单
        case 'outsource': // 委外加工单
        case 'materials': // 退料单
          this.requisition(filterRes)
          break
      }
      uni.navigateBack({ delta: 1 })
    },
    // 生产工序
    process(filterRes) {
      let list = []
      list = filterRes.map((item) => {
        return {
          id: item.id,
          // 商品编号
          goods_code: item.goods_code,
          // 商品备注
          goods_note: item.note,
          // 商品单位ID
          goods_unit: item.goods_unit,
          // 数量
          number: item.number,
          // 基本单位ID
          default_unit: item.unit_id,
          // 基本数量
          basic_nmber: item.basic_nmber,
          // 商品单价
          purchase: item.purchase,
          // 金额
          money: item.number * item.purchase,
          // 展示：
          unit_name: item.unit_name,
          default_unit_name: item.default_unit_name,
          goods_name: item.goods_name,
          goods_image: item.goods_image
        }
      })

      getApp().globalData.goods.list = [
        ...getApp().globalData.goods.list,
        ...list
      ]
    },
    // 生产计划、生产单
    prod_plan(filterRes) {
      let list = []
      list = filterRes.map((item) => {
        return {
          id: item.id,
          // 编辑商品用到的（提交参数）
          // 商品编号（商品详情获取或者通用->商品价格接口获取）
          goods_code: item.goods_code,
          //  商品规格型号
          goods_note: item.goods_note,
          //  商品单位ID（资料->商品获取商品单位列表，用户选择）
          goods_unit: item.goods_unit,
          //  数量（默认为1，用户修改）
          number: item.number,
          //  基本单位ID（商品详情获取或者通用->商品价格接口获取）
          default_unit: item.unit_id,
          //  基本数量（默认为1，多单位时需要换算，或者通过通用->价格变动接口格式化）
          basic_nmber: item.basic_nmber,
          //  商品单价（通用->商品价格获取）
          purchase: item.purchase,
          //  金额
          money: item.number * item.purchase,
          // 编辑商品用到的（展示参数）
          default_unit_name: item.default_unit_name, //基本单位名称
          // goods_name: item.goods_name //商品名称
          // unit_name: item.unit_name, //商品单位

          // mes-goods显示中用到的
          unit_name: item.unit_name, //数量单位
          goods_image: item.goods_image, //图片
          goods_name: item.goods_name, //商品名称
          // goods_code: item.goods_code //商品编号
          // purchase: item.purchase, //单价
          // number: item.number //数量
          // 序列号
          serial_status: item.serial,
          serial:[],
          batch:item.batch,//是否开启批次
          attr_name: item.attr_name,
          auxiliary: item.auxiliary, //属性状态
          period: [],
          // 获取序列号用到的参数 stores_id：仓库id attribute_id：商品属性id goods_code：商品编号 store_status：商品是否在库
          // goods_code:'',
          goods_attr: item.attribute_id,
          stores_id: item.manager_warehouse_id,
          store_status: 1, //在库状态:1=在库,2=出库 领料查在库，退料查出库
          batch_id: '', //批次ID
          batch_name: '', //批次名称
          manufacture: '', //批次生产日期
          guarantee: item.shelf_life, //批次保质期
          validity: '' //批次有效期至

          // 序列号
          // serial_status: item.serial, //是否开启序列号
          // period: [], //序列号数组
          // goods_code: '', //商品编号
          // stores_id: '', //仓库ID
          // goods_attr: '', //商品属性
          // store_status: 1 //在库状态:1=在库,2=出库 领料查在库，退料查出库
        }
      })
      list.forEach((item) => {
        if (item.serial_status) {
        } else if (item.batch) {
        }
      })
      getApp().globalData.goods.list = [
        ...getApp().globalData.goods.list,
        ...list
      ]
    },
    // 验收单
    receipt(filterRes) {
      let list = []
      list = filterRes.map((item) => {
        return {
          id: item.id,
          // 商品编号
          goods_code: item.goods_code,
          // 商品备注
          goods_note: item.note,
          // 商品属性ID
          goods_attr: item.goods_attr,
          auxiliary: item.auxiliary, //属性状态
          // 商品单位ID
          goods_unit: item.goods_unit,
          // 仓库ID
          stores_id: item.manager_warehouse_id,
          // 生产数量
          need_number: '',
          // 验收数量
          number: item.number,
          // 基本单位ID
          default_unit: item.unit_id,
          // 基本数量
          basic_nmber: item.basic_nmber,
          // 商品单价
          unit_price: item.purchase,
          // 购货金额
          all_money: item.number * item.purchase,
          // 备注
          remark: '',
          // 批次ID
          batch_id: '',
          // 批次名称
          batch_name: '',
          // 生产日期
          manufacture: '',
          // 保质期
          guarantee: '',
          // 有效期至
          validity: '',
          serial_status: item.serial, //开启序列号
          batch:item.batch,//是否开启批次
          // 序列号数组
          serial: [],
          period: [],
          // 单位数组
          unit_options: item.unit_options,
          // 展示：
          attr_name: item.attr_name,
          unit_name: item.unit_name,
          default_unit_name: item.default_unit_name,
          goods_name: item.goods_name,
          goods_image: item.goods_image
        }
      })
      list.forEach((item) => {
        if (item.serial_status) {
        } else if (item.batch) {
        }
      })
      getApp().globalData.goods.list = [
        ...getApp().globalData.goods.list,
        ...list
      ]
    },
    // 领料单、委外加工单、退料单
    requisition(filterRes) {
      let list = []
      list = filterRes.map((item) => {
        return {
          id: item.id,
          // 商品编号
          goods_code: item.goods_code,
          // 商品备注
          goods_note: item.note,
          // 商品属性ID
          goods_attr: item.goods_attr,
          auxiliary: item.auxiliary, //属性状态
          // 商品单位ID
          goods_unit: item.goods_unit,
          // 仓库ID
          stores_id: item.manager_warehouse_id,
          // 可用库存
          allow_stock: item.stock,
          // 数量
          number: item.number,
          // 基本单位ID
          default_unit: item.unit_id,
          // 基本数量
          basic_nmber: item.basic_nmber,
          // 商品单价
          unit_price: item.purchase,
          // 购货金额
          all_money: item.number * item.purchase,
          // 序列号
          serial_status: item.serial, //开启序列号新加的
          batch:item.batch,//是否开启批次
          // 备注
          remark: '',
          // 批次ID
          batch_id: '',
          // 批次名称
          batch_name: '',
          // 生产日期
          manufacture: '',
          // 保质期
          guarantee: '',
          // 有效期至
          validity: '',
          // 序列号数组
          serial: [],
          period: [],
          // 单位数组
          unit_options: item.unit_options,
          // 展示：
          attr_name: item.attr_name,
          unit_name: item.unit_name,
          default_unit_name: item.default_unit_name,
          goods_name: item.goods_name,
          goods_image: item.goods_image
        }
      })
      //新加的
      list.forEach((item) => {
        if (item.serial_status) {
        } else if (item.batch) {
        }
      })

      getApp().globalData.goods.list = [
        ...getApp().globalData.goods.list,
        ...list
      ]
    },
    // 初始化
    init() {
      if (
        // BOM 清单、生产计划、验收单添加商品：成品
        // 其它都是原材料
        this.pageType === 'prod_plan' ||
        this.pageType === 'receipt'
      ) {
        this.goods_types = 2
      }
    }
  }
}
</script>

<style lang="less" scoped>
.page {
  overflow: hidden;
  min-height: 100vh;
  background-color: #f7f7f7;
}

// 相机
.camera {
  width: 100vw;
  height: 50vh;
  .camera-outside {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    .camera-border {
      position: relative;
      width: 400rpx;
      height: 400rpx;
      .border {
        position: absolute;
        width: 48rpx;
        height: 48rpx;
        &.b1 {
          left: 0;
          top: 0;
          border-left: 8rpx solid #45f0d2;
          border-top: 8rpx solid #45f0d2;
        }
        &.b2 {
          right: 0;
          top: 0;
          border-right: 8rpx solid #45f0d2;
          border-top: 8rpx solid #45f0d2;
        }
        &.b3 {
          left: 0;
          bottom: 0;
          border-left: 8rpx solid #45f0d2;
          border-bottom: 8rpx solid #45f0d2;
        }
        &.b4 {
          right: 0;
          bottom: 0;
          border-right: 8rpx solid #45f0d2;
          border-bottom: 8rpx solid #45f0d2;
        }
      }
      .camera-animation {
        position: absolute;
        top: 0;
        left: 10rpx;
        width: 380rpx;
        height: 6rpx;
        background-color: #45f0d2;
        border-radius: 50%;
      }
    }
    .camera-tip {
      margin-top: 60rpx;
      text-align: center;
      color: #ccc;
      font-size: 24rpx;
    }
  }
}

// 商品
.goods-box {
  overflow: scroll;
  height: calc(50vh - 164rpx);
  padding-bottom: 20rpx;
  .item {
    position: relative;
    display: flex;
    align-items: center;
    margin: 20rpx auto 0;
    padding: 24rpx;
    width: 702rpx;
    background: #ffffff;
    border-radius: 16rpx;
    .item-left {
      display: flex;
      align-items: center;
      margin-right: 20rpx;
      image {
        width: 160rpx;
        height: 160rpx;
        border-radius: 8rpx;
      }
    }
    .item-right {
      display: flex;
      flex-direction: column;
      justify-content: space-around;
      .item-name {
        font-size: 32rpx;
        font-weight: 500;
        color: #111;
      }
      .item-info {
        view {
          font-size: 24rpx;
          color: #666;
        }
      }
    }
    .icon-shanchu {
      position: absolute;
      right: 30rpx;
      bottom: 24rpx;
      color: #000;
      font-size: 50rpx;
    }
  }
}
</style>
